<template>
	<view class="spacemanage">
		<view class="topBox">
			<view class="searchBox">
				<view class="history" @click="backhisy">
					<u-icon name="arrow-left" color="#323232" size="18"></u-icon>
				</view>
				<view class="search">
					<u-icon name="search" color="#ccc" size="26"></u-icon>
					<input type="text" placeholder="产品名称或手机号搜索" placeholder-style="color:#ccc;" v-model="search"/>
					<view class="box_search" @click="btnsearch">搜索</view>
				</view>
			</view>
			<view class="navTab">
				<view :class="showTab==10?'active':''" @click="tab(10)">已上架</view>
				<view :class="showTab==20?'active':''" @click="tab(20)">已下架</view>
			</view>
			<view class="smlnavTab" v-if="showTab==10">
				<view :class="smltype==''?'active':''" @click="changeType('')"><text>全部</text></view>
				<view :class="smltype=='payment'?'active':''" @click="changeType('payment')"><text>待付款</text></view>
				<view :class="smltype=='paid'?'active':''" @click="changeType('paid')"><text>待确认</text></view>
				<!-- <view :class="smltype=='resold'?'active':''" @click="changeType('resold')"><text>待转售</text></view> -->
				<view :class="smltype=='conduct'?'active':''" @click="changeType('conduct')"><text>出售中</text></view>
				<view :class="smltype=='recycle'?'active':''" @click="changeType('recycle')"><text>已回购</text></view>

			</view>
		</view>
		<view class="shop-list" :class="showTab==10?'shopcon':''">
			<view class="shop-every" v-for="item in list" :key="item.order_id">
				<view class="order-title">
					<view>更新时间:{{item.update_time}}</view>
					<view class="state" v-if="showTab==10 && item.order_type!=5">{{item.order_status}}</view>
					<view class="state" v-if="showTab==10 && item.order_type==5 && item.exchange_order==1">未兑换</view>
					<view class="state" v-if="showTab==10 && item.order_type==5 && item.exchange_order==2">已兑换</view>
				</view>
				<view class="shop-con clearfix">
					<image :src="item.goods.goods_image"></image>
					<view class="shop-right">
						<view class="title">{{item.goods.goods_name}}</view>
						<view class="bot-box">
							<view>商品价格：<text>￥{{item.goods.goods_price}}</text></view>
							<view>
								<text>持有人</text>
								{{item.member.member_name}}({{item.member.member_phone}})
							</view>
							<view>
								<text>买家</text>
								{{item.buy_member.member_name}}({{item.buy_member.member_phone}})
							</view>
						</view>
					</view>
				</view>
				<view class="box_btn" v-if="showTab==10 && item.order_type!=5">
          <view @click="huigou(item.order_id,item.goods.goods_id)" v-if="item.order_status=='出售中'">回购</view>
          <view @click="quxiao(item.order_id)" v-if="item.consignment_status==1">取消</view>
					<view @click="updown(item.order_id,20)">下架</view>
					<view @click="release(item.order_id)" v-if="item.order_status=='卖家举报中'">释放</view>
					<view @click="fabric(item.order_id,3)" v-if="item.order_status=='出售中'">指派</view>
					<view @click="cfbtn(item.order_id)" v-if="item.order_status=='出售中'">拆分</view>
					<view @click="fabric(item.order_id,2)" v-if="item.order_status=='出售中'">转移</view>
					<view @click="paysure(item.order_id)" v-if="item.order_status=='确认收款'">确认收款</view>
				</view>
        <view class="box_btn" v-if="showTab==10 && item.order_type==5 && item.exchange_order==1">
          <view @click="exchange(item.order_id)">兑换积分</view>
        </view>
				<view class="box_btn" v-if="showTab==20">
					<view @click="updown(item.order_id,10)">上架</view>
				</view>
			</view>
		</view>
		<view class="nidata" v-if="!list.length">
			<image src="../../static/images/noimg.png"></image>
		</view>
		<u-popup mode="center" :round="5" :show="showflag">
			<view class="numbergoods_con">
				<view class="goods-title" v-if="cpnum==2">转移</view>
				<view class="goods-title" v-if="cpnum==3">指派会员</view>
				<!-- <view class="caifen">输入拆分数量，可拆分2份或3份拆分后得价格不小于2000</view> -->
				<view class="identifier" style="margin-top: 0;" v-if="cpnum!=3">
					<input placeholder="请输入对方空间编号" placeholder-style="color:#999" v-model="number"/>
				</view>
				<view class="identifier" style="margin-top: 0;" v-if="cpnum==3">
					<input placeholder="请输入会员手机号" placeholder-style="color:#999" v-model="phone"/>
				</view>
				<view class="sml-btn clearfix">
					<view @click="showflag = false">取消</view>
					<view @click="cpsure">确认</view>
				</view>
			</view>
		</u-popup>
		<u-modal
		:show="sfflag" 
		title="是否确认释放" 
		width="300"
		border-radius="0"
		:show-cancel-button="true"
		cancel-color="#323232"
		confirm-color="#323232"
		:title-style="{'font-size':'32rpx','font-weight': '800'}"
		:content-style="{color:'#999','font-size':'28rpx'}"
		:cancel-style="{'border-right': '2rpx solid $uni-background-color'}"
		cancelText="拒绝"
		@confirm="confirm"
		@cancel="cancel">
		</u-modal>
		<u-modal
		:show="caifflag" 
		title="是否确认拆分" 
		width="300"
		border-radius="0"
		:show-cancel-button="true"
		cancel-color="#323232"
		confirm-color="#323232"
		:title-style="{'font-size':'32rpx','font-weight': '800'}"
		:content-style="{color:'#999','font-size':'28rpx'}"
		:cancel-style="{'border-right': '2rpx solid $uni-background-color'}"
		@confirm="cfconfirm"
		@cancel="caifflag=false">
		</u-modal>
	</view>
</template>

<script>
	export default {
		data(){
			return{
				search:'',
				showTab:10,
				showflag:false,
				page:1,
				list:[],
				last_page:1,
				cpnum:1,
				order_id:'',
				number:'',
				phone:'',
				sfflag:false,
				smltype:'',
				caifflag:false,
        space_id: '',
			}
		},
		onLoad(options) {
      this.space_id = options.space_id
			this.getinit()
		},
		onReachBottom() {
			if(this.list.length){
				this.page = this.page + 1
				if (this.page <= this.last_page) {
					this.getinit()
				}
			}
		},
		methods:{
			getinit(){
				this.request('/space/getOrderList',{
					page:this.page,
					type:this.showTab,
					goods_name:this.search,
					data_type:this.smltype
				}).then(res => {
					if(res.data.code==1){
						this.list = this.list.concat(res.data.data.data)
						this.last_page = res.data.data.last_page
					}
				})
			},
			paysure(order_id){
				this.request('/order/getConsignmentCollection',{order_id:order_id}).then(res => {
					if(res.data.code==1){
						this.$tip(res.data.msg)
						this.list = []
						this.page = 1
						this.getinit()
					}else{
						this.$tip(res.data.msg)
					}
				})
			},
			quxiao(order_id){
				this.request('/Space/cancelOrder',{order_id:order_id}).then(res => {
					if(res.data.code==1){
						this.$tip(res.data.msg)
						this.list = []
						this.page = 1
						this.getinit()
					}else{
						this.$tip(res.data.msg)
					}
				})
			},
      huigou(order_id,goods_id){
        this.request('/Space/toRepurchase',{order_id:order_id}).then(res => {
          uni.navigateTo({
            url: '/pages/loot/lootsubmit?id='+goods_id+'&order_id='+res.data.data+'&from_type='+this.space_id
          });
        })
      },
      exchange(order_id){
        this.request('/Space/toExchangeOrder',{order_id:order_id}).then(res => {
          if(res.data.code==1){
            this.$tip(res.data.msg)
            this.list = []
            this.page = 1
            this.getinit()
          }else{
            this.$tip(res.data.msg)
          }
        })
      },
			updown(order_id,t){
				this.request('/space/toGoodsStatus',{order_id:order_id,goods_status:t}).then(res => {
					if(res.data.code==1){
						this.$tip(res.data.msg)
						this.list = []
						this.page = 1
						this.getinit()
					}else{
						this.$tip(res.data.msg)
					}
				})
			},
			release(order_id){
				this.order_id = order_id
				this.sfflag = true
			},
			confirm(){  //DIAJ
				this.request('/space/toReleaseOrder',{order_id:this.order_id,status:1}).then(res => {
					if(res.data.code==1){
						this.$tip(res.data.msg)
						this.getinit()
						this.sfflag = false
					}else{
						this.$tip(res.data.msg)
						this.sfflag = false
					}
					
				})
			},
			cancel(){
				this.request('/space/toReleaseOrder',{order_id:this.order_id,status:2}).then(res => {
					if(res.data.code==1){
						this.$tip(res.data.msg)
						this.getinit()
						this.sfflag = false
					}else{
						this.$tip(res.data.msg)
						this.sfflag = false
					}
					
				})
			},
			backhisy(){
				uni.navigateBack()
			},
			btnsearch(){
				this.list = []
				this.page = 1
				this.getinit()
			},
			tab(t){
				this.showTab = t
				this.list = []
				this.page = 1
				this.getinit()
			},
			changeType(t){
				this.smltype = t
				this.list = []
				this.page = 1
				this.getinit()
			},
			fabric(order_id,t){
				this.cpnum = t
				this.order_id = order_id
				this.showflag = true
			},
			cfbtn(order_id){
				this.caifflag = true
				this.order_id = order_id
			},
			cfconfirm(){
				this.request('/space/toSplit',{order_id:this.order_id,num:1}).then(res => {
					if(res.data.code==1){
						this.$tip(res.data.msg)
						this.list = []
						this.page = 1
						this.showflag = false
						this.caifflag = false
						this.getinit()
					}else{
						this.$tip(res.data.msg)
					}
				})
			},
			cpsure(){
				if(this.cpnum ==2){
					if(this.number==''){
						this.$tip("请先输入转移空间编号")
						return
					}
					this.request('/Space/toTransfer',{order_id:this.order_id,num:this.number}).then(res => {
						if(res.data.code==1){
							this.$tip(res.data.msg)
							this.list = []
							this.page = 1
							this.showflag = false
							this.getinit()
						}else{
							this.$tip(res.data.msg)
						}
						this.number = ""
						
					})
				}else if(this.cpnum ==3){
					if(this.phone==''){
						this.$tip("请先输入会员手机号")
						return
					}
					this.request('/space/toAssign',{order_id:this.order_id,phone:this.phone}).then(res => {
						if(res.data.code==1){
							this.$tip(res.data.msg)
							this.list = []
							this.page = 1
							this.showflag = false
							this.getinit()
						}else{
							this.$tip(res.data.msg)
						}
						this.phone = ""
					})
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	.spacemanage{
		min-height: 100%;
		background: #F8F8F8;
		.topBox{
			position: fixed;
			top: 0;
			width: 100%;
			background: #fff;
			z-index: 9;
			padding-top: 80rpx;
			/* #ifdef H5 */
			padding-top: 30rpx;
			/* #endif */
			.searchBox{
				display: flex;
				align-items: center;
				.history{
					width: 8%;
					text-align: center;
				}
				.search{
					display: flex;
					align-items: center;
					width: 89%;
					height: 60rpx;
					background: $uni-background-color;
					border-radius: 6rpx;
					.u-icon{
						margin: 0 14rpx;
						top: 0;
					}
					input{
						width: 82%;
						font-size: 24rpx;
					}
					.box_search{
						width: 18%;
						height: 40rpx;
						line-height: 40rpx;
						text-align: center;
						margin: 10rpx 0;
						font-size: 28rpx;
					}
				}
			}
			.navTab{
				height: 80rpx;
				line-height: 80rpx;
				border-bottom: $uni-border-bottom;
				margin-top: 10rpx;
				view{
					position: relative;
					float: left;
					width: 50%;
					height: 100%;
					text-align: center;
					font-size: 28rpx;
					color: #999;
				}
				.active{
					font-weight: 800;
					color: $uni-item-color;
				 }
				.active::after{
				    content: '';
				    position: absolute;
				    bottom: 0;
				    width: 42rpx;
				    height: 4rpx;
				    background-color: $uni-item-color;
				    left: 50%;
				    transform: translateX(-50%);
				}
			}
			.smlnavTab{
				height: 88rpx;
				line-height: 88rpx;
				border-bottom: $uni-border-bottom;
				view{
					position: relative;
					float: left;
					width: 20%;
					text-align: center;
					text{
						display: inline-block;
						width: 120rpx;
						height: 50rpx;
						text-align: center;
						font-size: 24rpx;
						color: #999;
						line-height: 46rpx;
						box-sizing: border-box;
					}
				}
				.active{
					text{
						background: #FFFBFB;
						border: 1rpx solid #E23B2C;
						border-radius: 50rpx;
						color: #E23B2C;
					}
				 }
			}
		}
		.shop-list{
			margin-top: 232rpx;
			/* #ifdef H5 */
			margin-top: 182rpx;
			/* #endif */
			.shop-every{
				background: #fff;
				margin-bottom: 18rpx;
				padding: 0 30rpx;
				.order-title{
					display: flex;
					justify-content: space-between;
					align-items: center;
					height: 82rpx;
					border-bottom: 1rpx solid #eee;
					view{
						font-size: 28rpx;
						color: #999;
					}
					.state{
						font-size: 26rpx;
						color: $uni-text-color;
					}
				}
				.shop-con{
					padding: 30rpx 0;
					>image{
						float: left;
						width: 200rpx;
						height: 200rpx;
						border-radius: 10rpx;
					}
					.shop-right{
						float: left;
						display: flex;
						flex-direction: column;
						justify-content: space-between;
						width: calc(100% - 220rpx);
						height: 200rpx;
						margin-left: 20rpx;
						.title{
							font-size: 28rpx;
							overflow: hidden;
							text-overflow: ellipsis;
							white-space: nowrap;
						}
						.bot-box{
							>view{
								font-size: 26rpx;
								text{
									font-size: 26rpx;
								}
								&:first-of-type{
									text{
										color: $uni-text-color;
									}
								}
								&:nth-of-type(2),
								&:nth-of-type(3){
									margin-top: 20rpx;
									text{
										display: inline-block;
										width: 96rpx;
										height: 36rpx;
										background: #E56C35;
										color: #fff;
										text-align: center;
										line-height: 36rpx;
										margin-right: 20rpx;
									}
								}
							}
						}
					}
				}
				.box_btn{
					display: flex;
					justify-content: flex-end;
					align-items: center;
					height: 100rpx;
					border-top: 1rpx solid #eee;
					view{
						margin-left: 30rpx;
						font-size: 28rpx;
						color: #E56C35;
						height: 58rpx;
						border: 1rpx solid #E56C35;
						padding: 0 26rpx;
						line-height: 58rpx;
					}
				}
			}
		}
		.shopcon{
			margin-top: 320rpx;
			/* #ifdef H5 */
			margin-top: 270rpx;
			/* #endif */
		}
		.numbergoods_con{
			width: 580rpx;
			.goods-title{
				font-size: 32rpx;
				color: #202020;
				font-weight: 800;
				text-align: center;
				padding: 38rpx 0;
			}
			.caifen{
				width: 360rpx;
				font-size: 24rpx;
				color: #E56C35;
				margin: 0 auto;
				text-align: center;
				line-height: 34rpx;
				margin-bottom: 30rpx;
			}
			.identifier{
				width: 478rpx;
				height: 88rpx;
				border: 1rpx solid #999;
				margin: 28rpx auto 50rpx;
				input{
					font-size: 26rpx;
					height: 100%;
					text-align: center;
				}
			}
			.sml-btn{
				height: 92rpx;
				border-top: $uni-border-bottom;
				view{
					float: left;
					width: 50%;
					text-align: center;
					font-size: 28rpx;
					box-sizing: border-box;
					line-height: 92rpx;
					&:first-of-type{
						color: #999;
						border-right: $uni-border-bottom;
					}
				}
			}
		}
	}
</style>